<template>
<view>
<view class="space_detail_container" v-if="spaceData">
<view class="SwiperContainer">
    <swiper class="SwiperIndex" autoplay="true" interval="5000" duration="500" @change="swiperChange">
      <block v-for="(item, swiper) in imgArr" :key="swiper">
        <swiper-item :data-imageUrl="imgArr" :data-index="index" @tap="lookBigImage">
          <image mode="aspectFit" :src="item.firstImage + '?x-oss-process=style/normal'"></image>
        </swiper-item> 
      </block>
    </swiper>
    <view class="swiperItemIndex">{{swiperIndex}}/{{totalImg}}</view>
  </view>  
  <!-- 空间内容 -->
  <view class="space_detail_head">
      <view class="space_detail_center">
        <view class="space_detail_blcok">
            <text class="space_detail_name">{{spaceData.name}}</text>
            <view class="focus_block" :style="'background:linear-gradient(90deg,'+color+ ' 0%,'+secondColor+' 100%)'">
                <image src="https://image1.sansancloud.com/gongyixiangmu/2020_1/7/15/34/57_61.jpg?x-oss-process=style/preview_120" class="focus_icon"></image>
                <text class="focus_text">关注</text>
            </view>
        </view>
        <view class="space_detail_addr" @tap="clickCatch">
            <image src="https://image1.sansancloud.com/gongyixiangmu/2020_1/7/15/19/5_295.jpg?x-oss-process=style/preview_120" class="space_detail_addr_icon"></image>
            <text class="space_detail_addr_text">{{spaceData.address}}</text>
        </view>
      </view>
  </view>
  <!-- 负责人 -->
  <view class="manager_user_block" v-if="spaceData.managerPlatformUserId">
      <image :src="spaceData.managerPlatformUserUrl||setting.platformSetting.logo" class="manager_user_icon"></image>
      <view class="manager_user_info">
          <text class="manager_user_name">{{spaceData.managerPlatformUserName}}</text>
          <text class="manager_user_type">{{spaceData.name}}负责人</text>
      </view>
      <view class="manager_user_chat" :data-link="'chat_room.html?puid='+spaceData.managerPlatformUserId+'&puname='+spaceData.managerPlatformUserName" @tap='tolinkUrl'>
          <text>聊天</text>
      </view>
  </view>
  <!-- 空间简介 -->
  <view class="space_description" v-if="spaceData.description">
    <text class="space_description_text">{{spaceData.description}}</text>
  </view>
   <!-- 空间的资产类别 -->
  <!-- <view class="assets_type_list">
    <scroll-view scroll-x="true" style="white-space: nowrap; display: block" class="showmian">
      <view @tap="tolinkUrl" class="assetsType_item" :data-link="'asset_list.html?spaceId=' + spaceData.id + '&assetTypeId=' + assetType.id" v-for="(assetType, index) in spaceData.assetTypes" :key="index">
        <image class="assetsType_icon" :src="assetType.icon"></image>
        <text class="assetsType_text">{{assetType.name}}</text>
      </view>
    </scroll-view>
  </view> -->
  <!-- 组织类型 -->
  <!-- <view class="lease_content">
    <view class="organizes_head">
      <view @tap="clickTypeTab" data-type="1" :class="(currentTab==1?'organizes_tab have_border':'organizes_tab')">
        <image class="organizes_icon" v-if="currentTab==1" src="https://image1.sansancloud.com/xianhua/2019_1/23/10/30/22_187.jpg"></image>
        <image class="organizes_icon no" v-else src="https://image1.sansancloud.com/xianhua/2019_1/23/10/30/22_176.jpg"></image>
        <text :class="(currentTab==1?'organizes_text have_color':'organizes_text')">组织</text>
      </view>
      <view @tap="clickTypeTab" data-type="2" :class="(currentTab==2?'personal_tab have_border':'personal_tab')">
        <text :class="(currentTab==2?'personal_text have_color':'personal_text')">个人</text>
        <image class="personal_icon" v-if="currentTab==2" src="https://image1.sansancloud.com/xianhua/2019_1/23/10/30/22_184.jpg"></image>
        <image class="personal_icon no" v-else src="https://image1.sansancloud.com/xianhua/2019_1/23/10/30/21_861.jpg"></image>
      </view>
    </view>
    <view class="lease_list" v-if="leaseData.length!=0">
      <view class="lease_item" v-for="(organizeItem, index) in leaseData" :key="index" @tap="tolinkUrl" :data-link="'organize_detail.html?organizeId=' + organizeItem.id">
        <image class="lease_item_img" mode="aspectFill" :src="organizeItem.firstImage"></image>
        <view class="lease_item_info">
          <text class="lease_item_name">{{organizeItem.name}}</text>
          <text class="lease_item_industry">{{organizeItem.industry}}</text>
        </view>
      </view>
    </view>
    <view v-else class="no_lease"><text>主人~还没有任何组织或个人租赁哦！</text></view>
  </view> -->
</view>
 <!-- 首页组件-公共产品详情装饰-->
 <custom-page-index-component :receiveData="sendIndexData" v-if="sendIndexData"></custom-page-index-component>
</view>
</template>

<script>

import publicFun from '../../wxcomponents/public/publicFun.wxs'

export default {
  data() {
    return {
      setting: null,
      // setting 
      spaceData: null,
      // 商品数据 
      targs: null,
      posterState: false,
      qrCodeUrl: "",
      swiperIndex: 1,
      totalImg: 0,
      organizesList: [],
      currentTab: 1,
      color: '',
      secondColor: "",
      leaseData: [],
      dataFOr_getData: {
        id: '',
        addShopId: ''
      },
      pintuanParam: "",
      visiblePintuanNum: 0,
      pintuanState: false,
      imgArr: [],
      spaceId: "",
      sendIndexData: "",
      article_article: ""
    };
  },

  props: {},
  onError: function (options) {
    console.log("on error!!!");
  },
  onLoad: function (options) {
    this.publicFun = publicFun;
    console.log('--------product----------', options);
    let that = this;
    that.setData({
      setting: getApp().globalData.setting
    });
    that.setData({
      spaceId: options.spaceId,
      color: getApp().globalData.setting.platformSetting.defaultColor,
      secondColor: getApp().globalData.setting.platformSetting.secondColor
    });
    let sendIndexData = JSON.stringify({
      title: 'noTitle',
      url: "space",
      params: {
        pageObjectId: options.spaceId,
        pageObjectType: 30
      }
    });
    that.setData({
      sendIndexData: sendIndexData
    });
    console.log("商品id和店铺id", options);
    that.dataFOr_getData.id = options.id;
    that.setData({
      dataFOr_getData: that.dataFOr_getData
    });
    that.getData(options);
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {
    this.setData({
      setting: getApp().globalData.setting
    });
  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {},

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {},

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {},

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {
      
      wx.stopPullDownRefresh();
  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {},

  /**
   * 用户点击右上角分享
   */
  onShareTimeline:function(){
    return this.shareFun()
  },
  onShareAppMessage: function (res) {
    console.log(res);
    return this.shareFun()
  },
  methods: {
    shareFun:function(){
        let that = this;
        let params = that.dataFOr_getData;
        let productItem = that.spaceData;
        
        if (!productItem.brandName || productItem.brandName == "") {
          productItem.brandName = "";
        };
        let shareName = '活动价：￥' + productItem.price + '(原价：￥' + productItem.tagPrice + ')' + productItem.brandName + productItem.name;
        console.log('params:', params, that.spaceData);
        return getApp().globalData.shareForFx2('productDetail', shareName, params);
    },
    clickTypeTab: function (e) {
      console.log("====clickTypeTab====", e);
      let that = this;
      let currentTab = e.currentTarget.dataset.type;

      if (currentTab == 1) {
        that.setData({
          leaseData: that.spaceData.organizes
        });
      } else {
        that.setData({
          leaseData: that.spaceData.personal || []
        });
      }

      that.setData({
        currentTab: currentTab
      });
    },

    /*轮播图下标*/
    swiperChange: function (e) {
      this.setData({
        swiperIndex: e.detail.current + 1
      });
    },

    // 关闭海报
    getChilrenPoster(e) {
      let that = this;
      that.setData({
        posterState: false
      });
    },

    showPoster: function () {
      console.log('===showPoster====', getApp().globalData.clientNo);
      let that = this;
      this.getQrCode();
      that.setData({
        posterState: true
      });
    },
    toIndex: function () {
      getApp().globalData.toIndex();
    },
    posterStateFun: function (state) {
      console.log('====state====', state);
      this.setData({
        posterState: true
      });
    },
    tolinkUrl: function (e) {
      if (!getApp().globalData.loginUser) {
        wx.showModal({
          title: '提示',
          content: '主人~您还在登陆哦!稍等片刻',
          success: function (res) {
            if (res.confirm) {
              console.log('用户点击确定');
            } else if (res.cancel) {
              console.log('用户点击取消');
            }
          }
        });
        return;
      }

      let linkUrl = e.currentTarget.dataset.link;
      getApp().globalData.linkEvent(linkUrl);
    },
    lookBigImage: function (e) {
      console.log("111111111", e.currentTarget.dataset);
      let imgSrc = e.currentTarget.dataset.imageurl;
      let imgArray = [];
      let index = e.currentTarget.dataset.index;
      let PostImageSrc = [];
      console.log(imgSrc);

      for (let i = 0; i < imgSrc.length; i++) {
        imgArray.push(imgSrc[i].imagePath);
        PostImageSrc.push(imgSrc[i].imagePath.replace(/http/, "https"));
      } // let PostImageSrc = imgSrc


      console.log(PostImageSrc);

      if (!imgSrc) {
        return;
      } // let urls = []
      // urls.push(imgSrc)


      wx.previewImage({
        current: imgArray[index],
        // 当前显示图片的http链接
        urls: imgArray // 需要预览的图片http链接列表

      });
    },

    /**
     * 生命周期函数--监听页面加载
     */
    getOrganizesData: function (spaceId) {
      let that = this;
      let data = {
        spaceId: spaceId
      };
      that.setData({
        pintuanParam: data
      });
      var pintuanUrl = getApp().globalData.AddClientUrl("/wx_find_asset_space_organizes.html", data, 'post');
      wx.request({
        url: pintuanUrl.url,
        data: pintuanUrl.params,
        header: getApp().globalData.headerPost,
        method: 'POST',
        success: function (res) {
          console.log('--------add----------');
          console.log(res.data);
          that.setData({
            organizesList: res.data.relateObj.result
          });

          if (that.organizesList.length == 1) {
            that.setData({
              visiblePintuanNum: 1
            });
          } else {
            that.setData({
              visiblePintuanNum: 2
            });
          }
        },
        fail: function (res) {
          getApp().globalData.loadFail();
        },
        complete: function () {
          wx.hideLoading();
        }
      });
    },
    getData: function (options) {
      let param = {};
      let that = this;

      if (!options) {
        param = that.dataFOr_getData;
      } else {
        param = options;
      } // wx.showLoading({
      //   title: 'loading'
      // })


      getApp().globalData.showToastLoading('loading', true);
      console.log('==param===', param);
      let postParam = {};
      postParam.spaceId = param.spaceId;
      let customIndex = getApp().globalData.AddClientUrl("/wx_get_asset_space_detail.html", postParam);
      wx.request({
        url: customIndex.url,
        header: getApp().globalData.header,
        success: function (res) {
          console.log(res);
          that.setData({
            pintuanState: false
          });
          console.log('--------------getData-------------');
          that.setData({
            spaceData: res.data.relateObj
          });

          if (res.data.relateObj.firstImage) {
            that.setData({
              totalImg: 1,
              imgArr: [{
                firstImage: res.data.relateObj.firstImage
              }]
            });
          }

          if (res.data.relateObj.organizes && res.data.relateObj.organizes.length) {
            that.setData({
              leaseData: res.data.relateObj.organizes
            });
          }

          if (res.data.relateObj.text) {
            //WxParse.wxParse('article', 'html', res.data.relateObj.text, that, 10)
            setTimeout(function () {
              that.article_article = res.data.relateObj.text;
            });
            console.log('====article====', that.article);
          }

          console.log('spaceData', that.spaceData);
        },
        fail: function (res) {
          console.log("====fail=====");
          getApp().globalData.loadFail();
        },
        complete: function (res) {
          wx.hideLoading();
        }
      });
    },
    getCart: function () {
      var params = {};
      params.productId = 0;
      params.count = 0;
      params.type = 'add';
      this.postParams(params);
    },
    // 获取二维码
    getQrCode: function () {
      let userId = "";

      if (getApp().globalData.loginUser && getApp().globalData.loginUser.platformUser) {
        userId = 'MINI_PLATFORM_USER_ID_' + getApp().globalData.loginUser.platformUser.id;
      } // console.log("app.loginUser.platformUser", app.loginUser.platformUser.id)
      // path=pageTab%2findex%2findex%3fAPPLY_SERVER_CHANNEL_CODE%3d'


      let postParam = {};
      postParam.SHARE_PRODUCT_DETAIL_PAGE = this.proId;
      postParam.scene = userId; // 上面是需要的参数下面的url

      console.log('====pp======', "/super_shop_manager_get_mini_code.html?mini=1&path=pageTab%2findex%2findex%3fSHARE_PRODUCT_DETAIL_PAGE%3d" + this.proId + "%26scene%3d" + userId);
      var customIndex = getApp().globalData.AddClientUrl("/super_shop_manager_get_mini_code.html?mini=1&path=pageTab%2findex%2findex%3fSHARE_PRODUCT_DETAIL_PAGE%3d" + this.proId + "%26scene%3d" + userId, postParam, 'get', '1');
      var result = customIndex.url.split("?");
      customIndex.url = result[0] + "?" + result[1];
      console.log("customIndex", customIndex.url, result[0]);
      var that = this;
      that.setData({
        qrCodeUrl: customIndex.url
      });
    },
    // 定位
    clickCatch: function (e) {
      console.log(this.spaceData);
      let latitude = this.spaceData.latitude;
      let longitude = this.spaceData.longitude;
      let name = this.spaceData.name;
      let address = this.spaceData.province + this.spaceData.city + this.spaceData.area + this.spaceData.address;
      wx.openLocation({
        latitude: latitude,
        longitude: longitude,
        scale: 12,
        name: name,
        address: address
      });
    },
    setData: function (obj) {
      let that = this;
      let keys = [];
      let val, data;
      Object.keys(obj).forEach(function (key) {
        keys = key.split('.');
        val = obj[key];
        data = that.$data;
        keys.forEach(function (key2, index) {
          if (index + 1 == keys.length) {
            that.$set(data, key2, val);
          } else {
            if (!data[key2]) {
              that.$set(data, key2, {});
            }
          }

          data = data[key2];
        });
      });
    }
  }
};
</script>
<style>
@import "./index.css";
</style>